<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>博文尚美</title>
    <link rel="stylesheet" href="index.css" />
  </head>
  <body>
    <!-- nav部分 -->
    <div class="header center clearfix">
      <div class="header-left fl">
        <img src="images/log.png" alt="" />
      </div>
      <ul class="header-right fr size14">
        <li><a href="">ABOUT</a></li>
        <li><a href="">PROTFOLIO</a></li>
        <li><a href="">SERVICE</a></li>
        <li><a href="">NEWS</a></li>
        <li><a href="">CONTACT</a></li>
      </ul>
    </div>
    <!-- 轮播图部分 -->
    <div class="banner">
      <ul>
        <li>
          <img src="images/banner.png" alt="" />
        </li>
      </ul>
      <ol class="list">
        <li></li>
        <li class="list-tow"></li>
        <li></li>
        <li></li>
      </ol>
    </div>

    <!-- 服务范围部分 -->
    <!-- 服务范围头部 -->
    <div class="ScopeOfServices_header">
      <div class="ScopeOfServices_header_box">
        <span class="ScopeOfServices_header_box_left"></span>
        <div class="size14">服务范围</div>
        <span class="ScopeOfServices_header_box_right"></span>
      </div>
      <p class="size14">OUR SERVICES</p>
    </div>
    <!-- 服务范围内容部分 -->
    <div class="ScopeOfServices_content clearfix center">
      <ul>
        <li>
          <img src="./images/section1-img1.png" alt="" />
          <p class="text1">1.WEB DESIGN</p>
          <p class="text2 size14">
            企业品牌网站设计/手机网站制作 动画网站创意设计
          </p>
        </li>
        <li>
          <img src="./images/section1-img2.png" alt="" />
          <p class="text1">2.GRAPHIC DESIGN</p>
          <p class="text2 size14">
            标志logo设计/产品宣传册设计 企业广告/海报设计
          </p>
        </li>
        <li>
          <img src="./images/section1-img3.png" alt="" />
          <p class="text1">3.E-BUSINESS PLAN</p>
          <p class="text2 size14">
            淘宝/天猫装修设计及运营推广 企业微博、微信营销
          </p>
        </li>
        <li>
          <img src="./images/section1-img4.png" alt="" />
          <p class="text1">4.MAILBOXAGENTS</p>
          <p class="text2 size14">
            腾讯/网易企业邮箱品牌代理 个性化邮箱定制开发
          </p>
        </li>
      </ul>
    </div>
    <!-- 服务范围部分 -->

    <!-- 客户案例 -->
    <!-- 客户案例头部 -->
    <div class="CustomerCase">
      <div class="ScopeOfServices_header">
        <div class="ScopeOfServices_header_box">
          <span class="ScopeOfServices_header_box_left"></span>
          <div>{&nbsp;客户案例&nbsp;}</div>
          <span class="ScopeOfServices_header_box_right"></span>
        </div>
        <p class="size14">
          With the best professional technology, to design the best innovative
          web site
        </p>
      </div>
      <!-- 客户案例内容部分 -->
      <div class="CustomerCase_content center clearfix">
        <ul>
          <li>
            <img src="./images/section2.png" alt="" />
          </li>
          <li>
            <img src="./images/section2.1.png" alt="" />
          </li>
          <li>
            <img src="./images/section2.2.png" alt="" />
          </li>
        </ul>
      </div>
      <a href="javascript:;" class="size14">VIEW MORE</a>
    </div>
    <!-- 最新资讯 -->
    <div class="section4">
      <div class="ScopeOfServices_header">
        <div class="ScopeOfServices_header_box">
          <span class="ScopeOfServices_header_box_left"></span>
          <div>最新资讯</div>
          <span class="ScopeOfServices_header_box_right"></span>
        </div>
        <p class="size14">TEH LATEST NEWS</p>
      </div>
      <!-- 下半部分 -->
      <div class="CustomerCase_content center clearfix">
        <img src="./images/img4.png" alt="客户案例图片" />
        <div class="section4-right-right">
          <!-- 上块 -->
          <div class="right-top-box">
            <div class="right-top-box1 clearfix">
              <div class="right-top-box-title">
                09
                <div>JAN</div>
              </div>
              <div class="right-top-box-right">
                <div class="size14 p1">网站排名进入前三的技巧说明</div>
                <div class="size12 p2">
                  很多客户都会纳闷为什么自己的网站老是优化不到搜索引擎
                  首页，更不用说进首页前三了。那么网站优...
                </div>
              </div>
            </div>
            <div class="right-top-box1">
              <div class="right-top-box-title">
                08
                <div>JAN</div>
              </div>
              <div class="right-top-box-right">
                <p class="size14 p1">网站排名进入前三的技巧说明</p>
                <p class="size12 p2">
                  很多客户都会纳闷为什么自己的网站老是优化不到搜索引擎
                  首页，更不用说进首页前三了。那么网站优...
                </p>
              </div>
            </div>
          </div>
          <!-- 下块 -->
          <div class="right-top-box">
            <div class="right-top-box1">
              <div class="right-top-box-title">
                07
                <div>JAN</div>
              </div>
              <div class="right-top-box-right">
                <div class="size14 p1">网站排名进入前三的技巧说明</div>
                <div class="size12 p2">
                  很多客户都会纳闷为什么自己的网站老是优化不到搜索引擎
                  首页，更不用说进首页前三了。那么网站优...
                </div>
              </div>
            </div>
            <div class="right-top-box1">
              <div class="right-top-box-title">
                06
                <div>JAN</div>
              </div>
              <div class="right-top-box-right">
                <div class="size14 p1">网站排名进入前三的技巧说明</div>
                <div class="size12 p2">
                  很多客户都会纳闷为什么自己的网站老是优化不到搜索引擎
                  首页，更不用说进首页前三了。那么网站优...
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- footer -->
    <div class="fotter">
      <div class="fotter-nav-right clearfix size12">
        <ul>
          <li><a href="#">Home </a></li>
          <li><a href="#">About</a></li>
          <li><a href="#">Portfolio </a></li>
          <li style="border: none"><a href="#">Contact</a></li>
        </ul>
      </div>
    </div>
  </body>
</html>
